<style>
body {
    margin: 0;
}

#scroller {
    overflow-y: scroll;
    overflow-x: hidden;
    width: 413px;
    height: 317px;

    margin-left: 120;
    margin-top: 340;
}

.bloat {
    height: 10000px;
}

#rel-pos {
    position: relative;
    left: 560px;
    top: 780px;
    width: 100px;
    height: 200px;

    transform: translateZ(0);
    overflow: hidden;
}

#abs-pos {
    position: absolute;
    left: 123px;
    top: 456px;
    width: 300px;
    height: 400px;

    transform: translateZ(0);
    overflow: hidden;
}
</style>
<div id="scroller">
    <div id="rel-pos">
        <div class="bloat"></div>
    </div>
    <div id="abs-pos">
        <div class="bloat"></div>
    </div>
    <div class="bloat"></div></div>
</div>
